<template>
  <Row :gutter="16">
    <iCol span="11" v-for="(route,index) in routerList" :key="index" v-show="!route.notShow">
      <Card :bordered="false">
        <p slot="title">{{route.meta.title}}</p>
        <Button
          type="primary"
          long
          v-for=" (children,index) in route.children "
          :key="index"
          @click="changeRouter(children.path)"
          class="buttonClass"
        >{{children.meta.title}}</Button>
      </Card>
    </iCol>
  </Row>
</template>

<script>
import Routers from "../../router.js";
export default {
  data() {
    return {
      routerList: Routers.routes
    };
  },
  methods: {
    changeRouter(path) {
      this.$router.push(path);
    }
  },
  mounted() {}
};
</script>

<style scoped>
.buttonClass {
  margin: 4px;
}
</style>